import {
    a as createElementBlock,
    aa as mergeProps,
    b as createBaseVNode,
    d as defineComponent,
    f as computed,
    F as Fragment,
    I as renderSlot,
    J as mergeModels,
    j as renderList,
    m as useModel,
    n as normalizeClass,
    o as openBlock,
    t as toDisplayString,
    v as createTextVNode
} from "./index-Dfdf_Rjk.js";

const _hoisted_1 = ["title"];
const _hoisted_2 = ["type", "checked", "title", "onChange"];
const _sfc_main = /* @__PURE__ */ defineComponent({
    __name: "SelectGroup",
    props: /* @__PURE__ */ mergeModels({
        options: {},
        titles: {},
        props: {},
        multiple: {type: Boolean, default: false},
        compact: {type: Boolean}
    }, {
        "modelValue": {},
        "modelModifiers": {}
    }),
    emits: /* @__PURE__ */ mergeModels(["toggle"], ["update:modelValue"]),
    setup(__props, {emit: __emit}) {
        const props = __props;
        const emit = __emit;
        const modelValue = useModel(__props, "modelValue");
        const internalValue = computed({
            get: () => props.multiple ? Array.isArray(modelValue.value) ? modelValue.value : [] : modelValue.value,
            set: (newValue) => {
                modelValue.value = newValue;
            }
        });

        function toggleOption(option) {
            if (props.multiple) {
                const newValue = [...internalValue.value];
                const index = newValue.indexOf(option);
                if (index > -1) {
                    newValue.splice(index, 1);
                } else {
                    newValue.push(option);
                }
                internalValue.value = newValue;
            } else {
                internalValue.value = option;
            }
            emit("toggle");
        }

        function isSelected(option) {
            return props.multiple ? internalValue.value.includes(option) : internalValue.value === option;
        }

        return (_ctx, _cache) => {
            return openBlock(), createElementBlock("fieldset", {
                class: normalizeClass(["flex-inline flex-wrap overflow-hidden", _ctx.compact ? "gap-1px" : "gap-3"])
            }, [
                (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.options, (option, idx) => {
                    var _a, _b, _c, _d, _e, _f;
                    return openBlock(), createElementBlock("label", mergeProps({
                        key: option,
                        class: ["relative px-2.5 py-1", [
                            isSelected(option) ? "text-primary bg-primary/10 hover:bg-primary/10" : "text-gray-500 bg-hover hover:bg-selected",
                            _ctx.compact && idx === 0 ? "!rounded-l-md" : "",
                            _ctx.compact && idx === _ctx.options.length - 1 ? "!rounded-r-md" : "",
                            !_ctx.compact && "rounded-md",
                            ((_b = (_a = props == null ? void 0 : props.props) == null ? void 0 : _a[idx]) == null ? void 0 : _b.class) || ""
                        ]],
                        ref_for: true
                    }, (_c = props == null ? void 0 : props.props) == null ? void 0 : _c[idx], {
                        title: (_d = _ctx.titles) == null ? void 0 : _d[idx]
                    }), [
                        createBaseVNode("div", null, [
                            renderSlot(_ctx.$slots, "default", {
                                value: option,
                                title: (_e = _ctx.titles) == null ? void 0 : _e[idx],
                                index: idx
                            }, () => {
                                var _a2, _b2;
                                return [
                                    createTextVNode(toDisplayString((_b2 = (_a2 = _ctx.titles) == null ? void 0 : _a2[idx]) != null ? _b2 : option), 1)
                                ];
                            })
                        ]),
                        createBaseVNode("input", {
                            type: _ctx.multiple ? "checkbox" : "radio",
                            checked: isSelected(option),
                            title: (_f = _ctx.titles) == null ? void 0 : _f[idx],
                            class: "absolute inset-0 cursor-pointer op-0.1",
                            onChange: ($event) => toggleOption(option)
                        }, null, 40, _hoisted_2)
                    ], 16, _hoisted_1);
                }), 128))
            ], 2);
        };
    }
});
export {
    _sfc_main as _
};
